<template>
  <div>
    <LoginTop middleTop="登录bb">
      <div slot="right" style="font-size: 4vw" @click="$router.push('/register')">切换到注册</div>
    </LoginTop>
    <LoginText
    label="账号"
    style="margin: 4.167vw 0"
    rule="^.{6,16}$"
    placeholder="请输入账号"
    @inputChange="res => model.username=res"
    />
    <LoginText
    label="密码"
    rule="^.{6,16}$"
    placeholder="请输入密码"
    type="password"
    @inputChange="res => model.password=res"
    />
    <LoginBtn
    btntext="登录"
    @registerSubmit="registerSubmit"
    />
  </div>
</template>

<script>
import LoginTop from '@/components/common/LoginTop'
import LoginText from '@/components/common/LoginText'
import LoginBtn from '@/components/common/LoginBtn'
export default {
  data () {
    return {
      model: {
        username: '',
        password: ''
      }
    }
  },
  components: {
    LoginTop,
    LoginText,
    LoginBtn
  },
  methods: {
    async registerSubmit () {
      const rulg = /^.{6,16}$/
      const rul = new RegExp(rulg)
      if (rul.test(this.model.username) && rul.test(this.model.password)) {
        const res = await this.$http.post('/login', this.model)
        this.$msg.fail(res.data.msg)
        localStorage.setItem('token', res.data.token)
        localStorage.setItem('id', res.data.id)
        setTimeout(() => {
          this.$router.push('/userinfo')
        }, 1000)
        return null
      } else {
        this.$msg.fail('东西没对哦')
      }
    }
  },
  created () {
  }
}
</script>

<style>

</style>
